﻿<html><head>
	<meta charset="utf-8">
	<title>曲振飞 | 百度前端技术学院任务集</title>
	<link rel="stylesheet" type="text/css" href="css/index.css">
	<link rel="stylesheet" type="text/css" href="css/font-awesome.css">
	<script type="text/javascript" src="js/card.js"></script>
</head>
<body>
  	<header>
  		<div class="head">
  			<h2>百度前端技术学院</h2>
  			<div class="star">
  				<i class="icon-star"></i><i class="icon-star"></i><i class="icon-star"></i><i class="icon-star"></i><i class="icon-star"></i>
  			</div>
  			<nav>
  				<ul>
  					<li><a href="#">主页</a></li>
  					<li><a href="http://q-angelo.github.io/resume/">关于我</a></li>
  					<li><a href="http://www.javaxx.cn">我的博客</a></li>
  					<li><a href="#">学习资源</a></li>
  				</ul>
  			</nav>
  		</div>
 	</header>
 	<div class="tit-bg">
 		<div class="tit-content">

 		</div>
 		<div class="rwj">
 			<h3>百度前端学院<span>任务集</span></h3>
 		</div>
 	</div>
 	<div class="nav-con">
 		<div id="tit" class="tit">
 			<h4 onclick="show(0)" class="t-active">
 			<i class="i-active">1</i>一阶段之HTML</h4>
 			<h4 onclick="show(1)">
 			<i>2</i>二阶段之JS</h4>
 			<h4 onclick="show(2)">
 			<i>3</i>三阶段之UI</h4>
 			<h4 onclick="show(3)">
 			<i>4</i>四阶段之实战</h4>
 		</div>
 		<div id="content">
 			<div class="con-active">
 				<ul>
 					<li><a href="./task01/index.html" target="_blank">任务一(零基础HTML编码)</a></li>
 					<li><a href="./task02/index.html" target="_blank">任务二：零基础HTML及CSS编码（一）</a></li>
 					<li><a href="./task03/index.html" target="_blank">任务三：三栏式布局</a></li>
 					<li><a href="./task04/index.html" target="_blank">任务四：定位和居中问题</a></li>
 					<li><a href="./task05/index.html" target="_blank">任务五：零基础HTML及CSS编码（二）</a></li>
 					<li><a href="./task06/index.html" target="_blank">任务六：通过HTML及CSS模拟报纸排版</a></li>
 					<li><a href="./task07/index.html" target="_blank">任务七：实现技术产品官网的页面</a></li>
 					<li><a href="./task08/index.html" target="_blank">任务八：响应式网格（栅格化）布局</a></li>
 					<li><a href="./task09/index.html" target="_blank">任务九：使用HTMLCSS实现一个复杂页面</a></li>
 					<li><a href="./task10/index.html" target="_blank">任务十：Flexbox 布局练习</a></li>
 					<li><a href="./task11/index.html" target="_blank">任务十一：移动Web页面布局实践</a></li>
 					<li><a href="./task12/index.html" target="_blank">任务十二：学习CSS 3的新特性</a></li>
 				</ul>
 			</div>
 			<div>
 				<ul>

 					<li><a href="./task13/index.html">任务十三：零基础JavaScript编码（一）</a></li>
 					<li><a href="./task14/index.html">任务十四：零基础JavaScript编码（二）</a></li>
 					<li><a href="./task15/index.html">任务十五：零基础JavaScript编码（三）</a></li>
 					<li><a href="./task16/index.html">任务十六：零基础JavaScript编码（四）</a></li>
          <p style="border-bottom:1px solid #ccc;padding:170px 0 20px 5px;margin:0 45px;color: #313538;font-family:微软雅黑;">Js动画特效</p>
 					<li><a href="./js/1/index.html">一、js实现文字无缝滚动</a></li>
 					<li><a href="./js/2/index.html">二、js实现图片向左无缝滚动</a></li>
          <li><a href="./js/3/index.html">三、js实现文字间隙滚动</a></li>
          <li><a href="./js/4/index.html">四、js实现选项卡菜单切换</a></li>
          <li><a href="./js/5/index.html">五、js实现焦点图轮番滚动</a></li>
          <li><a href="./js/6/index.html">六、原生Ajax封装</a></li>
 				</ul>
 			</div>
 			<div>22</div>
 			<div>33</div>
 		</div>
 	</div>
 	<footer>
 		<div class="foot">
 		<small>© 2016 洛阳网站建设 QuFei. All Rights 曲振飞.</small> 
 		<i class="icon-twitter-sign"></i>
 		<i class=" icon-facebook"></i>
 		<i class="icon-pinterest-sign"></i>
 		 <i class="icon-github-sign"></i>
 		</div>
 	</footer>


</body></html>
